$normalColor: #fff;
$bodyBackgroundColor: #222;

// custom state
$boxColor: rgb(20, 20, 20);

$cardColor: rgb(23, 32, 42);

$iconColor: rgb(142, 68, 173);

$hoverColor: #1abc9c;

$linkColor: #58d68d;

$disabled: rgba(100, 100, 100, 0.9);

// table
$tableBorderColor: rgb(44, 62, 80, 0.4);
$tableActiveColor: rgb(27, 79, 114);
// thead
$theadBackground: rgb(40, 55, 71);
$theadColor: #aeb6bf;
$theadTextColor: rgb(195, 155, 211);
// tr
$trHoverColor: rgb(27, 79, 114);
$trTextColor: #666;

// highlight
$highlightTextColor: rgb(212, 172, 13);
$matchedTextColor: #58a6ff;

// antd
$modalBackground: #1b4f72;
$panelBackground: #1d1f21;
$panelFontColor: #fff;
$panelBorderRadius: 5px;
$maskBackground: rgba(66, 71, 164, 0.2);
$labelKeyColor: #f4d03f;
$labelValueColor: #139dcb;

$appPadding: 0px;

$httpStatus200: rgb(46, 204, 113);
$httpStatus304: #7f8c8d;
$scrollBarColor: rgb(165, 105, 189);
$errorTextColor: rgb(231, 76, 60);

$antModalBackground: #111;
$antModalBodyBackground: #1f1f1f;
$antModalTitleColor: rgb(165, 105, 189);

// detail panel
$detailContentBackground: rgb(23, 32, 42);
$detailTabsBackground: rgb(39, 55, 70);

@mixin scrollbar {
  &::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }
  &::-webkit-scrollbar-track {
    border-radius: 3px;
    background: $panelBackground;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: $scrollBarColor;
    box-shadow: inset 0 0 10px $scrollBarColor;
  }
}
